import { Col, Row } from "antd";
import { Component } from "react";
import Card from "./components/card";
import Chart01 from "./components/chart-01";
import request from "@/utils/request";
import Chart02 from "./components/chart-02";
import Chart03 from "./components/chart-03";
import Chart04 from "./components/chart-04";

export default class Home extends Component {
  state = {
    resp: null as any,
  };

  // 获取统计分析数据
  refresh = () => {
    request({
      url: "/admin/base/open/analysis",
      method: "GET",
    }).then((resp) => {
      console.log("resp", resp);
      this.setState({ resp });
    });
  };

  render() {
    return (
      <div>
        <Row gutter={[24, 24]}>
          <Col span={12}>
            <Card title="访问量">
              <Chart01 data={this.state.resp?.visits} />
            </Card>
          </Col>
          <Col span={12}>
            <Card title="区域排行">
              <Chart02 data={this.state.resp?.regionRanking} />
            </Card>
          </Col>
          <Col span={12}>
            <Card title="销售额">
              <Chart03 data={this.state.resp?.sales} />
            </Card>
          </Col>
          <Col span={12}>
            <Card title="访问来源">
              <Chart04 data={this.state.resp?.source} />
            </Card>
          </Col>
        </Row>
      </div>
    );
  }

  componentDidMount(): void {
    this.refresh();
  }
}
